<template>
    <div class="manage_content">
        <div class="search">
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item label="捐赠品名称：">
                    <el-input v-model="searchData.name" placeholder="捐赠品名称"></el-input>
                </el-form-item>
                <el-form-item label="是否显示：">
                    <el-select v-model="searchData.is_show" placeholder="是否显示">
                        <el-option label="显示" value="1"></el-option>
                        <el-option label="不显示" value="0"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="检索开始价钱(起)：">
                    <el-input type='number' v-model="searchData.start_worth" placeholder="检索开始价钱(起)"></el-input>
                </el-form-item>
                <el-form-item label="检索结束价钱(止)：">
                    <el-input type='number' v-model="searchData.end_worth" placeholder="检索结束价钱(止)"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
            </el-form>
            
        </div>
        <div class="content_table">
            <el-button type="text" @click="add">新增</el-button>
            <el-button type="text" @click="del" :disabled="delVal.length<1">删除</el-button>
            <!-- 新增 编辑-->
            <el-dialog :title="formtitle" :visible.sync="dialogFormVisible">
                <el-form  :rules="rules" ref="form"  :model="form" :label-width="formLabelWidth">
                    <el-form-item label="捐赠品名称"  prop="pdt_name">
                        <el-input v-model="form.pdt_name" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="捐赠品价格（元）" prop="pdt_worth">
                        <el-input v-model.number="form.pdt_worth" auto-complete="off" type="number"></el-input>
                    </el-form-item>
                    <el-form-item label="是否显示" prop="pdt_is_show">
                        <el-select v-model="form.pdt_is_show" placeholder="请选择是否显示">
                            <el-option label="不显示" value="0"></el-option>
                            <el-option label="显示" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="上传图片">
                        <input ref="pic" type="file">
                        <el-button type="text" @click="uploadImg">上传图片</el-button>
                        <img :src="form.pdt_imgurl" alt="">
                        <p class="el-form-item__error" v-if="!form.pdt_imgurl && img">请上传图片</p>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submit('form')">确定</el-button>
                        <el-button @click="cancel('form')">取消</el-button>
                    </el-form-item>
                </el-form>
            </el-dialog>
            <table-element :tableData='tableData' @msg='acquire'></table-element>
            <el-pagination v-if="tableData.data.length>0" :page-sizes="pageSizes" :page-size="page.page_limit" layout="sizes, prev, pager, next" :total="pageTotal" @size-change="handleSizeChange" @current-change='changePage'>
            </el-pagination>
        </div>
    </div>
</template>

<style scoped>
.manage_content {
    padding: 20px;
}

.el-pagination {
    padding: 20px;
}

content_table.el-pagination--small.el-pager li {
    /* font: 1em sans-serif; */
    font-size: 20px;
}
img {
    display:block;
    width:300px;
}
</style>

<script src='../../directive/content/donation_manage.js'></script>


